<template>
  <div id="app" :class="showState != '!' ? '' : 'changeStyle'">
    <router-view />
  </div>
</template>

<script>
import Cookies from 'js-cookie'
import { Base64 } from 'js-base64';
export default {
  name: 'App',
  data() {
    return {
      showState: ''
    }
  },
  metaInfo() {
    return {
      title: this.$store.state.settings.dynamicTitle && this.$store.state.settings.title,
      titleTemplate: title => {
        return title ? `${title} - ${process.env.VUE_APP_TITLE}` : process.env.VUE_APP_TITLE
      }
    }
  },
  created() {
    var myReg = /token=(.*)/,
      str = location.search.slice(0, -1)
    let res = location.search.slice(-1)
    this.showState = res
    let myArray = myReg.exec(str);
    if (myArray && myArray[1]) {
      const token = myArray[1]
      Cookies.set('Admin-Token', token)
      localStorage.setItem('Admin-Token', token)
      sessionStorage.setItem('showState', res)
    }
    // if(myArray[1]){
    //   let token=Base64.decode(myArray[1])
    //   Cookies.set('Admin-Token', token)
    //   console.log('成功',token);
    //   this.$router.push({ path:  "/" }).catch(()=>{});
    // }

    // console.log('query',this.$route.query);
    // console.log(1,location.search);
  }
  // 设置浏览器头部标题

}
</script>
<style lang="scss">
.changeStyle {
  .el-menu {
    border: none;
    height: 100%;
    width: 100% !important;

    .is-active {
      background-color: #971111 !important;
    }
  }
  .app-container {
    width: 100%;
  }
  .theme-dark .el-submenu .el-menu-item {
    background-color: #150c0c !important;

    &.is-active {
      background-color: #971111 !important;
    }
  }

  .sidebar-container .theme-dark .nest-menu .el-submenu > .el-submenu__title {
    background-color: transparent !important;
  }

  .el-pagination__total {
    color: #fff !important;
  }

  .el-form-item__label {
    color: #ffffff !important;
  }
  ::v-deep(.tableAdd) {
    background: transparent !important;
  }
  ::-webkit-scrollbar {
    width: 15px;
    /* 宽度 */
    height: 15px;
    /* 高度 */
  }

  ::-webkit-scrollbar-thumb {
    background-color: #2a81d3;
    /* 滑块背景颜色 */
    border-radius: 3px;
    /* 滑块圆角半径 */
  }

  ::-webkit-scrollbar-track {
    background-color: #0a64ba;
    /* 轨道背景颜色 */
  }

  .sidebar-container {
    .el-menu {
      border: none;
      height: 100%;
      width: 100% !important;

      .is-active {
        background-color: #1682e64f !important;
      }
    }
  }

  .theme-dark .el-submenu .el-menu-item {
    background-color: transparent !important;

    &.is-active {
      background-color: #1682e64f !important;
    }
  }

  .el-scrollbar__bar.is-vertical {
    background-color: transparent;
  }

  .el-pagination.is-background .el-pager li {
    background: transparent;
    color: #fff;
    border: none;
  }

  .el-pagination .btn-next .el-icon {
    color: #fff;
  }

  .el-pagination .el-pager li:not(.disabled).active {
    background: #0a64ba !important;
  }

  .el-pagination .el-pagination__jump .el-input__inner,
  .el-pagination .el-select .el-input .el-input__inner {
    background: transparent;
    color: #fff !important;
    border-color: #0a64ba !important;
  }

  .el-pagination .el-select .el-input .el-input__suffix .el-select__caret {
    color: #fff !important;
  }

  .el-pagination .btn-prev,
  .el-pagination .btn-next {
    background: transparent !important;
  }

  .el-input--suffix {
    .el-input__inner {
      border: 2px solid #2797ff;
    }
  }

  .el-pagination .el-pagination__jump {
    color: #fff !important;
  }
  .el-input--small {
    .el-input__inner {
      border: 2px solid #2797ff;
      color: #fff !important;
    }
  }

  .vue-treeselect__control {
    border: 2px solid #2797ff;
  }

  .el-form {
    border-bottom: 1px solid #2797ff !important;
  }

  .el-table::before {
    background: #2797ff;
  }

  .app-container,
  .vue-treeselect__control,
  .el-input--small .el-input__inner,
  .el-table th.el-table__cell.is-leaf,
  .el-button,
  .el-date-editor,
  .el-range-input,
  .pagination-container,
  .el-loading-mask,
  .el-submenu__title,
  .sidebar-container,
  .el-menu,
  .el-table__body {
    background: transparent !important;
  }

  .el-button {
    border: 1px solid #2797ff !important;
  }

  .navbar {
    background: #1682e64f !important;
  }

  #customTable,
  .el-button span,
  .el-table td.el-table__cell div,
  .el-table td.el-table__cell > .cell span,
  .el-table th.el-table__cell > .cell {
    color: #fff !important;
  }

  .el-table {
    background: transparent !important;
    background: transparent !important;
    border: 1px solid #2797ff !important;
    color: #fff !important;
  }

  .el-table tr {
    background: transparent !important;
  }

  .el-table .el-table__header-wrapper th {
    background: transparent !important;
  }

  .el-table .el-table__row td {
    border: 1px solid #2797ff !important;
  }

  .el-table .el-table__row td {
    border: 1px solid #2797ff !important;
  }

  .el-table th.el-table__cell.is-leaf,
  .el-table td.el-table__cell {
    border-bottom: 1px solid #2797ff !important;
  }

  .el-table--border .el-table__cell {
    border-right: 1px solid #2797ff !important;
  }

  .el-table td.el-table__cell {
    border: 1px solid #2797ff !important;
    background-color: transparent !important;
  }

  .el-table th.el-table__cell.is-leaf,
  .el-table td.el-table__cell {
    border: 1px solid #2797ff !important;
  }

  .el-table .el-table__row td {
    border-bottom: 1px solid #2797ff !important;
  }
}
</style>
